import ScrollBarLayout from '@/components/ScrollBarLayout';
import Cls from 'classnames';
import { useContext, useEffect } from 'react';
import { DocumentControllerContext } from '../common/useOAContext';
import { Form, Spin } from 'antd';
import { DescriptionsType, useDescriptionsType } from '@/components/DescriptionsType';
import moment from 'moment';
import { getColorTextLoadMap } from '@/utils';
import { ColumnsUpdateConfig } from '../mconfig/NewUpdateColumns';

export const DetailInfoCenterViewMainOA: React.FC = () => {
  const { styleFixCls, infoObj, radioState, procureReal } = useContext(DocumentControllerContext); /** 引入上下文 */
  const [formRef] = Form.useForm(); /** 表单实例 */

  /** 表格表单配置信息 */
  const [config, { setFieldsValue }] = useDescriptionsType({
    labelWidth: 200,
    schemas: ColumnsUpdateConfig({
      change: { changeRadio: () => {}, setIsShow: () => {}, handleDelFileFn: () => {}, handleAddFileFn: () => {}, changeFormFun: () => {} },
      state: { radioState, infoState: infoObj },
      // tableTypes: procureReal, // 表单根据不同的状态，显示不同的表单
      cardType: 'view',
      formRef,
    }) as any,
  });

  /** 初始化 */
  useEffect(() => {
    if (infoObj?.id) {
      /** 表单回显 */
      setFieldsValue({
        ...infoObj,
        siteVisitTime: infoObj?.siteVisitTime ? moment(infoObj?.siteVisitTime) : undefined,
        meetTime: infoObj?.meetTime ? moment(infoObj?.meetTime) : undefined,
        // bidMarginTime: infoObj?.bidMarginTime ? moment(infoObj?.bidMarginTime) : undefined,
        procureReal: getColorTextLoadMap(infoObj?.procureRealName)?.colorText,
        procureOrg: getColorTextLoadMap(infoObj?.procureOrgName)?.colorText,
      });
    }
  }, [infoObj]);

  return (
    <>
      <div className="commonTabsBodyDom">
        <div className={Cls('tabsBodyInfoDom', `${styleFixCls}updateFormBox`)}>
          <ScrollBarLayout style={{ padding: '0px 100px' }}>
            <Spin spinning={false}>
              <DescriptionsType config={config} />
            </Spin>
          </ScrollBarLayout>
        </div>
      </div>
    </>
  );
};
